/* 页面缩放时，高度不会变化 */
  
body {
    max-width: 540px;
    min-width: 320px;
    margin: 0 auto;
    font: normal 16px/1.5 PingFangSC-regular,Tahoma,Lucida Grande,Verdana,Microsoft Yahei,STXihei,hei;
    color: #000;
    background-color: #f2f2f2;
    overflow-x: hidden;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-text-size-adjust: none;
    border: 1px solid #000;
}
* {
    padding: 0;
    margin: 0;
}
list {
    list-style: none;
}
a {
    text-decoration: none;
}
div {
    box-sizing: border-box;
}
/* @font-face {
    font-family: 'icomoon';
    src:  url('../fonts/icomoon.eot?j74djo');
    src:  url('../fonts/icomoon.eot?j74djo#iefix') format('embedded-opentype'),
      url('../fonts/icomoon.ttf?j74djo') format('truetype'),
      url('../fonts/icomoon.woff?j74djo') format('woff'),
      url('../fonts/icomoon.svg?j74djo#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
  }   */
  @font-face {
    font-family: 'icomoon';
    src:  url('fonts/icomoon.eot?j74djo');
    src:  url('fonts/icomoon.eot?j74djo#iefix') format('embedded-opentype'),
      url('fonts/icomoon.ttf?j74djo') format('truetype'),
      url('fonts/icomoon.woff?j74djo') format('woff'),
      url('fonts/icomoon.svg?j74djo#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
  }
  
/* 顶部搜索 */
.search-index {
    display: flex;
    position: fixed;
    z-index: 9;
    top: 0;
    width: 100%;
    height: 44px;
    max-width: 540px;
    min-width: 320px;
    background-color: #fff;
}
.search {
    position: relative;
    height: 26px;
    border: 1px solid #0086F6;
    margin: 10px 10px;
    border-radius: 5px;
    line-height: 24px;
    color: #666;
    font-size: 14px;
    padding-left: 35px;
    flex: 1;
}
.user {
    height: 44px;
    width: 44px;
    text-align: center;
    line-height: 44px;
    color: #2eaae0;
}
.search::before {
    position: absolute;
    content: '';
    background: url(../img/精灵图.png) no-repeat -82px 0;
    width: 20px;
    height: 20px;
    background-size: 200px;
    left: 5px;
    top: 5px;
}


/* 主导航栏 */
.nav1 {
    border-radius: 8px;
    margin: 44px 10px 0 10px;
    overflow: hidden;
}
.nav-common {
    display: flex;
    height: 58px;
}
.nav-common:nth-child(2) {
    margin: 1px 0;
}
.nav-items {
    flex: 1;
}
.nav-items:nth-child(-n+4) {
    border-right: 1px solid #fff;
}
.nav-items a {
    display: flex;
    height: 100%;
    flex-direction: column;
    /* 设置侧轴x居中排列 */
    align-items: center;
    /* 设置主轴y居中排列 */
    justify-content: center;
    font-size: 12px;
    color: #fff;
}
.nav-items a span {
    width: 28px;
    height: 28px;
}
.nav-common:nth-child(n+2) .nav-items p {
    color: #000;
}
.nav-common:nth-child(n+2) .nav-items:nth-child(1) {
    background-color: #fff5f1;
}
.nav-common:nth-child(n+2) .nav-items:nth-child(2) {
    background-color: #eff9ff;
}
.nav-common:nth-child(n+2) .nav-items:nth-child(3) {
    background-color: #f2f5ff;
}
.nav-common:nth-child(n+2) .nav-items:nth-child(4) {
    background-color: #ecfcf8;
}
.nav-common:nth-child(n+2) .nav-items:nth-child(5) {
    background-color: #fff9f2;
}


/* 副导航栏 */
.nav2 {
    background-color: #fff;
    margin: 10px;
}
.nav-row {
    display: flex;
    height: 58px;
}
.nav-r {
    flex: 1;
}
.nav-r a {
    display: flex;
    height: 100%;
    flex-direction: column;
    /* 设置侧轴x居中排列 */
    align-items: center;
    /* 设置主轴y居中排列 */
    justify-content: center;
    font-size: 12px;
    color: #000;
}
.nav-r a span {
    width: 28px;
    height: 28px;
}


/* 直播和排行榜 */
.box {
    display: flex;
    padding: 0 10px;
    margin-bottom: 10px;
}
.box>div {
    overflow: hidden;
    flex: 1;
    background-color: #fff;
    flex-direction: column;
    border-radius: 5px;
}
.zhibo span {
    display: flex;
    padding: 5px;
}
.zhibo span div:nth-child(1) {
    flex: 1;
}
.zhibo span div:nth-child(1) {
    background: url(../img/特价直播.png) no-repeat;
    width: 73px;
    height: 20px;
    background-size: 73px 20px;
}
.zhibo span div:nth-child(3) {
    font-size: 12px;
    background-color: #FFEBE3;
    color: #FF4663;
} 
.zhibo>div {
    overflow: hidden;
    margin: 0 10px;
    height: 84px;
    background: url(../img/直播.jpg) no-repeat -4px -92px;
    background-size: 240px;
    border-radius: 5px;
}
.zhibo p {
    height: 20px;
    font-size: 16px;
    color: #f60;
    font-weight: 700;
    margin: 0 0 5px 10px;
}
.zhibo p::before {
    content: '￥';
    font-size: 12px;
}
.jx span {
    display: flex;
    padding: 5px;
}
.jx span div {
    flex: 1;
}
.jx span div:nth-child(1) {
    background: url(../img/精选榜.png) no-repeat;
    width: 73px;
    height: 20px;
    background-size: 73px 20px;
}
.jx span div:nth-child(3) {
    font-size: 12px;
    background-color: #FDEFD2;
    color: #B98130;
    text-align: center;
}
.jx>div {
    display: flex;
    margin: 0 10px;
}
.jx>div div {
    flex: 1;
}
.jx>div div:nth-child(1) span {
    background: url(../img/权威1.jpg) no-repeat -5px -12px;
    background-size: 119px;
    height: 74px;
    margin-right: 3px;
    border-radius: 5px;
}
.jx>div div:nth-child(2) span {
    background: url(../img/权威2.jpg) no-repeat -3px -4px;
    background-size: 117px;
    height: 74px;
    margin-right: 3px;
    border-radius: 5px;
}


/* banner */
.banner {
    overflow: hidden;
    margin: 10px;
    background: url(../img/banner.jpg) no-repeat;
    background-size: 516px 129px;
    border-radius: 15px;
    height: 129px;
}

footer {
    height: 182px;
    margin: 20px 10px;
}
.f-t {
    display: flex;
}
.f-t div {
    display: flex;
    flex: 1;
    justify-content: center;
}
.f-t div a  {
    width: 102px;
    height: 32px;
    border: 1px solid #666666;
    text-align: center;
    line-height: 32px;
    border-radius: 5px;
    font-size: 13px;
    color: #666666;
}
.f-t span {
    position: relative;
}
.f-t div:nth-child(1) a span::before {
    position: absolute;
    content: '\e942';
    font-family: 'icomoon';
    left: -16px;
    top: -7px;
}
.f-t div:nth-child(2) a span::before {
    position: absolute;
    content: '\e9c7';
    font-family: 'icomoon';
    left: -16px;
    top: -7px;
}
.f-c {
    margin-top: 10px;
    display: flex;
}
.f-c>div {
    flex: 1;
}
.f-c p {
    color: #666666;
    font-size: 12px;
}
.f-c>div:nth-child(1) p {
    float: right;
    margin-right: 24px;
}
.f-c>div:nth-child(2) p {
    float: left;
    margin-left: 24px;
}
.f-b {
    display: flex;
}
.f-b>div {
    flex: 1;
}
.f-b>div:nth-child(1) p {
    float: right;
}
.f-b>div:nth-child(2) p {
    float: left;
    margin-left: 5px;
}
.f-b p {
    color: #666666;
    font-size: 12px;
}


/* 切换栏 */
.bottom {
    display: flex;
    position: fixed;
    background-color: #fff;
    /* 固定定位必须有宽度 */
    width: 100%;
    z-index: 9;
    bottom: 0;
    max-width: 540px;
    min-width: 320px;
}
.bottom .b-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.b-item p {
    font-size: 12px;
}
.b-item span {
    width: 34px;
    height: 34px;
}
.b-item:nth-child(1) span {
    background: url(../img/底部精灵图.png) no-repeat -7px -7px;
    background-size: 48px;
}
.b-item:nth-child(2) span {
    background: url(../img/底部精灵图.png) no-repeat -7px -55px;
    background-size: 48px;
}
.b-item:nth-child(3) span {
    background: url(../img/底部精灵图.png) no-repeat -7px -102px;
    background-size: 48px;
}
.b-item:nth-child(4) span {
    background: url(../img/底部精灵图.png) no-repeat -7px -148px;
    background-size: 48px;
}

.mrqd {
    display: flex;
    position: fixed;
    bottom: 60px;
    right: 0;
    width: 76px;
    height: 76px;
}
.mrqd a {
    width: 76px;
    height: 76px;
    background: url(../img/每日签到.png) -1px -1px;
    background-size: 76px;
}